*{
    margin:0 ;
    padding:0;
    box-sizing: border-box;
}
.container{
    background-color: blue;
    padding:10px;
}
.item{
    display: block;
    background-color: #fff;
    box-shadow: 1px 1px 1px #999;
    padding:20px;
    color:#ccc;
    text-align: center;
}
.item span{
    font-size: 50px;
}
.container{
    display: flex;
    height:500px;
    /*flex-direction: row;*/
    /*flex-direction: row-reverse;*/
    /*flex-direction: column;*/
    /*flex-direction:column-reverse ;*/
    /*flex-wrap: nowrap;*/
    flex-wrap: wrap;
    /*flex-wrap: wrap-reverse;*/
    /*justify-content:flex-start;*/
    /*justify-content: flex-end;*/
    /*justify-content: center;*/
    /*align-items:center;*/
}
/*.item-1{*/
    /*order:1;*/
/*}*/
/*.item-3{*/
    /*order:-1;*/
/*}*/
/*.item-4{*/
    /*order:-2;*/
/*}*/
/*.item-2{*/
    /*order:2;*/
/*}*/
/*.item-1{*/
    /*flex-grow: 1;*/
/*}*/
/*.item-2{*/
    /*flex-grow: 2;*/
/*}*/
.item{
    /*flex-grow: 0;*/
    /*flex-shrink:0;*/
    /*flex-basis:33.333333%;*/
    /*flex: 0 0 33.333333%;*/
}
.item{
    /*align-self:flex-start;*/
    /*align-self: flex-end;*/
    /*align-self: center;*/
}
/*.item-1{*/
    /*align-self:flex-end;*/
/*}*/
/*.item-2{*/
    /*align-self: center;*/
/*}*/
/*.item-3{*/
    /*align-self: flex-start;*/
/*}*/
/*.item-4{*/
    /*align-self: center;*/
/*}*/
/*.item-5{*/
    /*align-self: flex-end;*/
/*}*/